import 'package:flutter/material.dart';
import 'package:flutter_vant/component/icon.dart';
import 'package:flutter_vant/component/loading.dart';
import 'package:flutter_vant/main.dart';
import 'package:rlstyles/main.dart';

class VanButtonType {
  static String normal = 'normal';
  static String primary = 'primary';
  static String success = 'success';
  static String warning = 'warning';
  static String danger = 'danger';
  static String info = 'info';
}

class VanButtonSize {
  static String large = 'large';
  static String small = 'small';
  static String mini = 'mini';
}

class VanButton extends HookWidget {
  // 按钮类型
  final String type;
  // 顶级元素class样式
  final dynamic styles;
  // 尺寸
  final String? size;
  // 是否圆角显示
  final bool? round;
  // 是否直角显示
  final bool? square;
  // 是否撑满
  final bool? block;
  // 是否简洁模式
  final bool? plain;
  // loading
  final bool? loading;
  // loading提示
  final String? loadingText;
  // loading大小
  final double loadingSize;
  // icon位置
  final String iconPosition;
  // 是否禁用
  final bool disabled;
  // 头发丝0.5
  final bool hairline;
  // 内容
  final String text;
  // icon颜色
  final dynamic iconColor;
  // icon大小
  final dynamic iconSize;
  // 图标
  final dynamic icon;
  // 加载类型
  final VanLoadingType? loadingType;
  // 点击事件
  final Function()? onClick;
  // 自定义颜色
  final dynamic color;
  VanButton(
      {this.type = 'normal',
      Key? key,
      this.styles,
      this.icon,
      this.loadingText = '',
      this.text = '',
      this.onClick,
      this.iconColor,
      this.iconPosition = 'left',
      this.loadingSize = 15,
      this.size = 'large',
      this.disabled = false,
      this.hairline = false,
      this.iconSize = 20.0,
      this.loading = false,
      this.loadingType = VanLoadingType.circular,
      this.round = false,
      this.square = false,
      this.block = false,
      this.plain = false,
      this.color})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    // 获取类型颜色
    dynamic getTypeColor() {
      if (color != null) return color;
      Map colors = {
        VanButtonType.normal: 'white',
        VanButtonType.warning: '#ff976a',
        VanButtonType.danger: '#ee0a24',
        VanButtonType.primary: '#1989fa',
        VanButtonType.success: '#07c160',
        VanButtonType.info: '#07c160'
      };
      return colors[type];
    }

    // 获取按钮颜色
    dynamic getBkColor() {
      if (color != null && plain == false) return color;
      Map colors = {
        VanButtonType.normal: 'white',
        VanButtonType.warning: '#ff976a',
        VanButtonType.danger: '#ee0a24',
        VanButtonType.primary: '#1989fa',
        VanButtonType.success: '#07c160',
        VanButtonType.info: '#07c160'
      };
      if (plain == true) {
        return 'white';
      } else {
        return colors[type];
      }
    }

    getStyles() {
      return {
        'button': [
          FL_Border(size: hairline == true ? 0.5 : 1.0),
          FL_Radius(size: round == true ? 999.0 : 0.0),
          FL_Opacity(size: disabled == true ? 0.5 : 1.0),
          FL_Color(color: type == 'normal' ? 'black' : 'white'),
          FL_PaddingLeft(size: 5),
          FL_PaddingRight(size: 5),
          FL_Height(size: 44),
          FL_FSize(size: 14.0),
          FL_AlignCenter,
          FL_JustifyCenter,
          FL_FlexRow,
          getStyle(styles)
        ],
        'btn-plain': [
          FL_Color(color: getTypeColor()),
          FL_BorderColor(
            color: type == 'normal' ? this.color ?? '#ebedf0' : getTypeColor(),
          )
        ],
        'btn-size-large': [
          FL_Width(size: double.infinity),
          FL_MinHeight(size: 42.0)
        ],
        'btn-size-normal': [FL_Width(size: 88.0), FL_MinHeight(size: 44.0)],
        'btn-size-mini': [
          FL_Width(size: 56.0),
          FL_Height(size: 24.0),
          FL_FSize(size: 12.0)
        ],
        'btn-size-small': [
          FL_Width(size: 64.0),
          FL_Height(size: 34.0),
          FL_FSize(size: 12.0)
        ],
        'btn-block': [FL_Width(size: double.infinity)]
      };
    }

    Map getColor() {
      return {
        VanButtonType.normal: Colors.black,
        VanButtonType.warning: '#ff976a',
        VanButtonType.danger: '#ee0a24',
        VanButtonType.primary: '#1989fa',
        VanButtonType.success: '#07c160'
      };
    }

    getIconColor() {
      Map obj = getColor();
      if (iconColor != null) return HexColor(iconColor);
      if (plain == true) {
        return HexColor(obj[type]);
      } else {
        if (type == VanButtonType.normal) {
          return Colors.black;
        } else {
          return Colors.white;
        }
      }
    }

    renderIcon(String position) {
      return VanIcon(
        child: icon,
        color: getIconColor(),
        size: iconSize,
      );
    }

    getLoadingState() {
      return loading != null && loading != false;
    }

    renderLoading() {
      return VanLoading(
        size: loadingSize,
        text: loadingText,
        type: loadingType,
      );
    }

    renderContent() {
      return TextView(
        loading == true ? loadingText ?? '请等待' : text,
        styles: {
          CssRule.fontWeight: 0,
          CssRule.fontSize: 15.0,
        },
      );
      // return;
    }

    getMainClass() {
      Map css = {
        'button': true,
        'btn-plain': plain,
        'btn-block': block,
        'btn-size-$size': size != null,
      };
      return StylesMap.getClass(css, getStyles());
    }

    onTapClick() {
      if (onClick != null) onClick!();
    }

    return Material(
        color: HexColor(getBkColor()),
        child: InkWell(
          onTap: disabled == true ? null : onTapClick,
          child: Frame(styles: getMainClass(), children: [
            renderIcon('left'),
            getLoadingState() ? renderLoading() : renderContent(),
            renderIcon('right')
          ]),
        ));
  }
}
